<template>
  <div>
    <h1>管理员列表</h1>
    <el-table :data="bannerlist" style="width: 100%,height: 100%">
      <el-table-column prop="adminid" label="管理员编号" />
      <el-table-column prop="adminname" label="管理员姓名" width="180" />
      <el-table-column prop="password" label="密码" />
      <el-table-column prop="role" label="密码" />

      <el-table-column label="操作">
        <template #default="scope">
          <el-popconfirm
            title="确定删除吗"
            @confirm="handleDelete(scope.row.adminid)"
          >
            <template #reference>
              <el-button size="small" type="danger">删除</el-button>
            </template>
          </el-popconfirm>
          <el-button size="small" type="danger" @click="isshow=true"
            >修改</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <edit v-show="isshow"></edit>
  </div>
</template>
  
  <script setup lang="ts">
import { reactive, ref } from "vue";
import service from "../../../utils/service";
import { Delete } from "@element-plus/icons-vue";
import { ElMessage } from "element-plus";
import "element-plus/dist/index.css";
import edit from "./edit.vue";
import { is } from "@babel/types";

interface ibanner {
  adminid: string;
  adminname: string;
  password: string;
  role: number;
}

const bannerlist = reactive<ibanner[]>([]);

const getbannerlist = () => {
  service({
    url: "/admin/list",
  }).then((res) => {
    if (res.data.code == "200") {
      (bannerlist.length = 0), bannerlist.push(...res.data.data);
    }
  });
};
getbannerlist();

const handleDelete = (adminid: string) => {
  service({
    url: "/admin/delete",
    method: "post",
    data: {
      adminid,
    },
  }).then((res) => {
    if (res.data.code == "200") {
      ElMessage({
        message: "删除成功！",
        type: "success",
      });
      getbannerlist();
    }
  });
};

// 修改
const isshow = ref(false);
const handleCreate = () => {};
</script>
  
  <style scoped>
.img {
  width: 100px;
  height: 100px;
}
</style>